<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="./css/index.css" />
    <link rel="stylesheet" href="./fa/css/all.min.css" />
    <link rel="stylesheet" href="./iconfont/iconfont.css" />
    <title>购购</title>
  </head>
  <body>
    <div class="banner">
      <header class="top-bar w">
        <div class="menu">
          <h2>4:15</h2>
        </div>
        <div class="menu-r">
          <a href="#">
            <i class="fas fa-stream"></i>
            <i class="fas fa-memory"></i>
            <i class="fas fa-wifi"></i>
          </a>
        </div>
      </header>
    </div>
    <div class="nav">
      <div class="nav-bar">
        <div class="nav-l">
          <a href="#">
            <i class="iconfont">&#xe850;</i>
          </a>
        </div>
        <div class="inp">
          <i class="iconfont">&#xe82e;</i>
          <input class="inp-z" type="text" placeholder="新品下单八折起" />
          <i class="iconfont">&#xe70d;</i>
        </div>
        <div class="nav-r">
          <a href="#">
            <i class="iconfont">&#xeb6b;</i>
          </a>
        </div>
      </div>
    </div>
    <div class="bt">
      <div class="bt-bar w">
        <ul class="items">
          <li>首页</li>
          <li>美妆</li>
          <li>数码</li>
          <li>零食</li>
          <li>女装</li>
          <li>箱包</li>
        </ul>
      </div>
    </div>
    <!-- 中间部分 -->
    <div class="centerImg-bar w">
      <!-- 图片区域 -->
      <div class="centerImg">
        <img src="./img/bj.png" alt="" />
      </div>
    </div>
    <!-- item区域 -->
    <div class="centerItem-bar w">
      <div class="Items">
        <a href="#">
          <img src="./img/c1.png" alt="" />
          <span>美妆精选</span>
        </a>
      </div>
      <div class="Items">
        <a href="#">
          <img src="./img/c2.png" alt="" />
          <span>母婴专区</span>
        </a>
      </div>
      <div class="Items">
        <a href="#">
          <img src="./img/c3.png" alt="" />
          <span>时尚家居</span>
        </a>
      </div>
      <div class="Items">
        <a href="#">
          <img src="./img/c4.png" alt="" />
          <span>数码电器</span>
        </a>
      </div>
      <div class="Items">
        <a href="#">
          <img src="./img/c5.png" alt="" />
          <span>生活服务</span>
        </a>
      </div>
    </div>
    <!-- hhh -->
    <div class="course-list w">
      <div class="course-bar">
        <!-- 标题 -->
        <div class="title">
          <h2>限时折扣</h2>
          <i class="iconfont">&#xe76b;</i>
        </div>
        <!-- 列表 -->
        <div class="item-list">
          <div class="cover">
            <img src="./img/nn.png" alt="" />
          </div>
          <div class="cover-x">
            <img src="./img/nn1.png" alt="" />
          </div>
          <div class="title-z">
            <a href="#"> 限时抢购 </a>
          </div>
        </div>
      </div>
     
      <div class="course-bar">
        <!-- 标题 -->
        <div class="title">
          <h2>限时折扣</h2>
          <i class="iconfont">&#xe76b;</i>
        </div>
        <!-- 列表 -->
        <div class="item-list">
          <div class="cover">
            <img src="./img/nn.png" alt="" />
          </div>
          <div class="cover-x">
            <img src="./img/nn1.png" alt="" />
          </div>
          <div class="title-z">
            <a href="#"> 限时抢购 </a>
          </div>
        </div>
      </div>
      
    </div>
    <div class="courseqqq-list w">
      <div class="course-bar">
        <!-- 标题 -->
        <div class="title">
          <h2>限时折扣</h2>
          <i class="iconfont">&#xe76b;</i>
        </div>
        <!-- 列表 -->
        <div class="item-list">
          <div class="cover">
            <img src="./img/nn.png" alt="" />
          </div>
          <div class="cover-x">
            <img src="./img/nn1.png" alt="" />
          </div>
          <div class="title-z">
            <a href="#"> 限时抢购 </a>
          </div>
        </div>
      </div>
     
      <div class="course-bar">
        <!-- 标题 -->
        <div class="title">
          <h2>限时折扣</h2>
          <i class="iconfont">&#xe76b;</i>
        </div>
        <!-- 列表 -->
        <div class="item-list">
          <div class="cover">
            <img src="./img/nn.png" alt="" />
          </div>
          <div class="cover-x">
            <img src="./img/nn1.png" alt="" />
          </div>
          <div class="title-z">
            <a href="#"> 限时抢购 </a>
          </div>
        </div>
      </div>
    </div>
    <div class="wenzi w">
      <h2>NEWS</h2>
       <p>Please enter thetitle and description</p>
    </div>
    <!-- item -->
    <div class="bt-bar w">
      <ul class="items">
        <li>首页</li>
        <li>美妆</li>
        <li>数码</li>
        <li>零食</li>
        <li>女装</li>
        <li>箱包</li>
      </ul>
    </div>
    <!--中下 -->
    <div class="zF-bar w">
      <div class="z-foobar">
        <!-- 放图片 -->
        <div class="mainImg">
          <img src="./img/zbj.png" alt="">
        </div>
        <div class="Img-title">
          <h3>请输入你的标题</h3>
        </div>
        <!-- 关键字 -->
        <div class="keyword">
          <div class="keyword-l">
            关键字
          </div>
          <div class="keyword-l">
            关键字
          </div>
        </div>
        <!-- 价格标 -->
        <div class="user-info">
          <h3 class="poice"><strong>￥</strong>358</h3> 
          <span>月销70846件</span>
          <i class="iconfont">&#xe686;</i>
        </div>
      </div>
      <div class="z-foobar">
        <!-- 放图片 -->
        <div class="mainImg">
          <img src="./img/zbj.png" alt="">
        </div>
        <div class="Img-title">
          <h3>请输入你的标题</h3>
        </div>
        <!-- 关键字 -->
        <div class="keyword">
          <div class="keyword-l">
            关键字
          </div>
          <div class="keyword-l">
            关键字
          </div>
        </div>
        <!-- 价格标 -->
        <div class="user-info">
          <h3 class="poice"><strong>￥</strong>358</h3> 
          <span>月销70846件</span>
          <i class="iconfont">&#xe686;</i>
        </div>
      </div>
    </div>
    <!-- footer -->
    <div class="footer-bar">
      <div class="footer">
        <a href="#">
          <i class="iconfont">&#xe855;</i>
          <p>首页</p>
        </a>
      </div>
      <div class="footer">
        <a href="#">
          <i class="iconfont">&#xe65a;</i>
          <p>直播</p>
        </a>
      </div>
      <div class="footer">
        <a href="#">
          <i class="iconfont">&#xe666;</i>
          <p>广场</p>
        </a>
      </div>  <div class="footer">
        <a href="#">
          <i class="iconfont">&#xe61d;</i>
          <p>首页</p>
        </a>
      </div>  
      <div class="footer">
        <a href="#">
          <i class="iconfont">&#xe607;</i>
          <p>我的</p>
        </a>
      </div>
    </div>
  </body>
</html>
